<template>
    <div class="app-container">
        <el-card shadow="never" style="margin-bottom:24px;">
            <el-row>
                <i class="el-icon-plus"></i>
                <span class="search-title">新增</span>
            </el-row>
            <el-row class="row-margin">
                <el-button type="primary" size="small" @click="handleAddCheck">
                    新增盘点
                </el-button>
            </el-row>
        </el-card>
        <el-dialog :visible.sync="goodsLookupModalVisible" destroy-on-close>
            <goods-lookup-modal :batchId="this.curBatchId" @hide="handleCloseLookupModal">
            </goods-lookup-modal>
        </el-dialog>
        <el-card class="filter-container" shadow="never">
            <el-row>
                <i class="el-icon-search"></i>
                <span>筛选搜索</span>
            </el-row>
            <el-row class="row-margin">
                <el-form :model="listQuery1" ref="filterFormRef1" inline>
                    <el-form-item prop="bactchNo">
                        <el-input
                            style="width:200px;"
                            clearable
                            placeholder="盘点单号"
                            suffix-icon="el-icon-search"
                            v-model="listQuery1.bactchNo"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item prop="startTime">
                        <el-date-picker
                            style="width:200px;margin-left:10px;"
                            placeholder="开始时间"
                            v-model="listQuery1.startTime"
                        ></el-date-picker>
                    </el-form-item>
                    <el-form-item prop="endTime">
                        <el-date-picker
                            style="width:200px;margin-left:10px;"
                            placeholder="结束时间"
                            v-model="listQuery1.endTime"
                        ></el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button
                            style="margin-left: 10px;"
                            @click="handleSearchStorageList1()"
                            type="primary"
                        >
                            查询
                        </el-button>
                        <el-button @click="handleResetCaptainSearch1()">
                            重置
                        </el-button>
                    </el-form-item>
                </el-form>
            </el-row>
        </el-card>
        <div class="table-container">
            <el-table
                ref="storageListTable1Ref"
                :data="storageDataList1"
                style="width: 100%"
                v-loading="listLoading1"
                border
            >
                <el-table-column label="盘点单号" width="100" align="center">
                    <template slot-scope="scope">{{ scope.row.batchNo }}</template>
                </el-table-column>
                <el-table-column label="操作人" align="center">
                    <template slot-scope="scope">{{ scope.row.operName }}</template>
                </el-table-column>
                <el-table-column label="系统件数" prop="intimeStock" align="center">
                    <template slot-scope="scope">{{ scope.row.intimeStock }}</template>
                </el-table-column>
                <el-table-column label="实际件数" prop="realStock" align="center">
                    <template slot-scope="scope">{{ scope.row.realStock }}</template>
                </el-table-column>
                <el-table-column label="库存损益" prop="diffStock" align="center">
                    <template slot-scope="scope">{{ scope.row.diffStock }}</template>
                </el-table-column>
                <el-table-column label="操作" width="160" align="center">
                    <template slot-scope="scope">
                        <el-button size="mini" @click="handleLookup(scope.row.id)">查询 </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="pagination-container">
            <el-pagination
                background
                @size-change="handleSizeChange1"
                @current-change="handleCurrentChange1"
                layout="total, sizes,prev, pager, next,jumper"
                :page-size="listQuery1.pageSize"
                :page-sizes="[5, 10, 15]"
                :current-page.sync="listQuery1.pageNum"
                :total="total1"
            >
            </el-pagination>
        </div>
    </div>
</template>
<script>
import { getStorageCheckManageList } from '@/api/storage';
import GoodsLookupModal from './components/goodsLookupModal';
import { parseTimeToCh } from '@/utils';

const defaultListQuery = {
    pageNum: 1,
    pageSize: 5,
    categoryId: null,
    startTime: null,
    endTime: null,
    batchNo: null,
    operType: null
};
export default {
    components: {
        GoodsLookupModal
    },
    data() {
        return {
            goodsLookupModalVisible: false,
            curBatchId: null,
            storageDataList1: [],
            listLoading1: false,
            listQuery1: Object.assign({}, defaultListQuery),
            total1: 0
        };
    },
    created() {
        this.getStorageList1();
    },
    watch: {},
    filters: {},
    methods: {
        getStorageList1() {
            this.listLoading1 = true;
            getStorageCheckManageList(this.listQuery1).then(res => {
                this.listLoading1 = false;
                if (res.data.success && Array.isArray(res.data.data)) {
                    this.storageDataList1 = res.data.data;
                    this.total1 = res.data.extra.total;
                } else {
                    this.storageDataList1 = [];
                }
            });
        },
        handleAddCheck() {
            this.$router.push('addCheck');
        },
        handleSearchStorageList1() {
            this.listQuery1.pageNum = 1;
            this.getStorageList1();
        },
        handleResetCaptainSearch1() {
            this.$refs.filterFormRef1.resetFields();
        },
        handleSizeChange1(val) {
            this.listQuery1.pageNum = 1;
            this.listQuery1.pageSize = val;
            this.getStorageList1();
        },
        handleCurrentChange1(val) {
            this.listQuery1.pageNum = val;
            this.getStorageList1();
        },
        handleLookup(batchId) {
            this.curBatchId = batchId;
            this.goodsLookupModalVisible = true;
        },
        handleCloseLookupModal() {
            this.goodsLookupModalVisible = false;
        },
        parseTimeToCh(val) {
            return parseTimeToCh(val);
        }
    }
};
</script>
<style></style>
